import { Component, Vue, Prop } from "vue-property-decorator";
import { Tools } from "@/model/tools.ts";
import { BASE64 } from "@/utils/tools";
import { GroupParamData } from "@/store/interface.ts";
import { queryData, deleteData } from "@/api/service.js";
import { UPLOAD_EXPORT_URL } from "@utils/type.ts";
@Component
export class Group extends Tools {
  public keyword: string = "";
  public totalSize: number = 0;
  public loading: boolean = true; //表格的loading
  public tableData: Array<any> = [];
  public chooseModelVisible: boolean = false;
  public selectedRowIds: Array<any> = []; //勾选ids
  public deleteTag: string = ""; //导入 or 删除
  public isExport: boolean = false; //弹框提示语
  // 请求参数封装对象
  public calendar: GroupParamData = {
    criteria: "",
    includeAttributes: [],
    pageNumber: 1,
    pageSize: 10
  };
  // 公共方法
  public handelerBtn(type: number) {
    console.log(type, "调用group.ts方法");
    if (type === 1) {
      //导出
      this.deleteTag = "export";
      this.isExport = true;
    } else {
      // 删除
      this.deleteTag = "choose";
      this.isExport = false;
    }
    this.chooseModelVisible = true; // 处理DataCalenDar.vue组件中的ChooseModal弹框层
  }

  /**
   * 公共的参数
   */
  public get queryParams() {
    return {
      pageNumber: this.calendar.pageNumber,
      pageSize: this.calendar.pageSize
    };
  }

  /**
   * 勾选的数据
   */
  public get deleteParams() {
    return {
      ids: this.selectedRowIds
    };
  }

  public get chooseTitle() {
    return this.isExport ? "请选择导出的对象" : "请选择删除的对象";
  }

  public async getList() {
    let [err, data] = await queryData(this.queryParams);
    this.loading = false;
    if (err) {
      let msg = err.msg || "获取列表数据信息异常";
      this.$Message.error(msg);
      return;
    }
    if (!data) return;
    this.totalSize = data.totalSize;
    this.tableData = data.rows;
  }
  public pageNumChange(num: number) {
    this.calendar.pageNumber = num;
    this.getList();
  }
  public pageSizeChange(num: number) {
    this.calendar.pageSize = num;
    this.getList();
  }

  /**
   * datacalendar.vue触发on-selection-change
   */
  public doSelect(val: Array<any>) {
    return (this.selectedRowIds = val.map(el => el.id));
  }

  public deleteConfirm(type) {
    this.closeChooseModal(); //关闭弹框
    if (!this.selectedRowIds.length) {
      this.$Message.error("请选择至少一条数据项");
      return;
    }
    //导出 or 删除方法
    this.deleteTag === "export" ? this.exportDataFile() : this.deleteData();
  }

  /**
   * 关闭弹窗
   */
  public closeChooseModal() {
    this.chooseModelVisible = false;
  }

  /**
   * 导出数据
   */
  public exportDataFile() {
    let params = BASE64.encode(JSON.stringify(this.deleteParams));
    window.open(`${UPLOAD_EXPORT_URL}` + `param=${params}`, "_self");
  }

  /**
   * 删除数据(单条 或者 多条)
   */
  public async deleteData() {
    const [err, data] = await deleteData(this.deleteParams);
    this.closeChooseModal();
    if (err) {
      let msg = err.message || "删除勾选数据异常";
      this.$Message.error(msg);
      return;
    }
    this.$Message.success("删除成功");
    this.getList();
  }
}
